/*
*this class has create a welcome page.
*this class extend flextable class. 
*it has three part
  *head: contains website name and logo
  *body: left body contains information about the website
         right body contain a login dialog
  *buttom: contains information about the company
*/
package fcc.Seng462project.client;


import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.DockPanel;
import com.google.gwt.user.client.ui.FlexTable;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.PasswordTextBox;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.HasVerticalAlignment;

public class LoginDialog extends FlexTable {
	
	
	public final TextBox PhoneNumber = new TextBox();
	public final PasswordTextBox Password = new PasswordTextBox();
		
	
	public final Button LoginButton = new Button("Login");
	
	public final Button RegisterButton= new Button("Register");
	
	public final HTML FindPassword= new HTML ("<div style='cursor:pointer' color='#2062B8'>"+ "FindPassword"+"</div>");
	
   //layout using html format. it create a header of our welcome page
	String loginHead="<table width='100%'><tr><td width='160' height='30' rowspan='2' style='padding-right: 10px;' valign='bottom'></td><td style='border-bottom: 1px solid rgb(204, 204, 204); padding-bottom: 2px;' height='60' nowrap='nowrap' valign='bottom'><font size='20' font color='#FDD017'><b>Welcome to FileCrate</b></font></td></table>";
   //layout for body of welcome page
	String bl="<table><tr><td><table><tr><td></td><td>  Presented by the FCC <p>  FileCrate Let's you say goodbye to your USB Drive! </td></tr></table></tr><tr><td colspan='30' height='40'></td></tr><tr><td><b>Security</b><td></tr><tr><td>  Nobody can look your files <td></tr><tr><td>&nbsp;</td></tr><tr><td><b>Convenience</b><td></tr><tr><td>  Carry your files around the world <td></tr><tr><td>&nbsp;</td></tr><tr><td><b>Free</b><td></tr><tr><td>  Free to register<td></tr><tr><td>  Free to upload and download<td></tr></table>";
   //layout for the button of welcome page
	String loginButtom="<div class='footer'	align='center'><font	color='#666666'>2012&copy;zhaiyaning@gmail.com</font> - <a href='/help.html'>About</a> - <a href='/Help.html'>Policy</a></div>";
	
	private final HTML head = new HTML(loginHead);
	private final HTML buttom=new HTML(loginButtom);
	private final HTML bodyLeft= new HTML(bl);
	
	private final HorizontalPanel body = new HorizontalPanel();
	private final FlexTable logPanelOut= new FlexTable();
	private final FlexTable logPanelIn= new FlexTable();
	private final DockPanel spacePanel=new DockPanel();
	private final VerticalPanel bodyRight=new VerticalPanel();
	private final DockPanel dockPanel = new DockPanel();
	private final Image image = new Image("image/FCC.jpg");
	
	public  LoginDialog(){
		//FlexTable ft= new FlexTable();
		PhoneNumber.setFocus(true);
		setCellPadding(8);
		setCellPadding(8);
		//Window.alert("I am at login Page");
		logPanelIn.setWidget(0, 0, new HTML("Sign in your FileCrate"));
		logPanelIn.setWidget(1, 0, new HTML("Email:"));
		logPanelIn.setWidget(1,1,PhoneNumber);
		logPanelIn.setWidget(2,0,new HTML("Passwrd:"));
		logPanelIn.setWidget(2,1,Password);
		logPanelIn.setWidget(3,1,LoginButton);
		logPanelIn.setWidget(3,2,RegisterButton);
		logPanelIn.setWidget(4,0,FindPassword);

		
		logPanelIn.getFlexCellFormatter().setColSpan(0, 0, 3);
		logPanelIn.getFlexCellFormatter().setColSpan(1, 1, 2);
		logPanelIn.getFlexCellFormatter().setColSpan(2, 1, 2);
		logPanelIn.getFlexCellFormatter().setColSpan(4, 0, 3);
		logPanelIn.getFlexCellFormatter().setWordWrap(1,0,false);
		//logPanelIn.setStyleName("footer");
		logPanelIn.setCellPadding(10);
		logPanelIn.setCellSpacing(10);
		
		logPanelOut.setWidget(0, 0, logPanelIn);
		logPanelOut.setCellPadding(2);
		logPanelOut.setCellSpacing(2);
		
		bodyRight.add(logPanelOut);
		
		body.add(dockPanel);
		dockPanel.setSize("157px", "309px");
		
		dockPanel.add(image, DockPanel.CENTER);
		dockPanel.setCellVerticalAlignment(image, HasVerticalAlignment.ALIGN_MIDDLE);
		image.setSize("161px", "258px");
		
		
		body.add(bodyLeft);
		spacePanel.setWidth("50px");
		body.add(spacePanel);
		body.add(bodyRight);
		
		setWidget(0,0,head);
		setWidget(1,0,body);
		setWidget(2,0,buttom);
		
		
	};
}